<template>
  <div class="contents">
    <el-row :gutter="5" type="flex" align="middle">
      <el-col :span="4">
        <el-select placeholder="选择仓库">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-col>
      <el-col :span="4">
        <el-select placeholder="客户类型">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-col>
      <el-col :span="4">
        <el-select placeholder="所属集团">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-col>
      <el-col :span="5">
        <el-select placeholder="所属业务员">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-col>
      <el-col :span="8">
        <el-input placeholder="输入客户名称/联系人/电话">
          <el-button slot="append" icon="el-icon-search"></el-button>
        </el-input>
      </el-col>
      <el-col :span="4">
        <el-checkbox>不显示余额为0的客户</el-checkbox>
      </el-col>
      <el-col :span="8" style="text-align: right;">
        <el-button>导出</el-button>
        <el-button>充值规则</el-button>
      </el-col>
    </el-row>
    <el-table :data="table1" style="width: 100%; margin-top: 10px;">
      <el-table-column prop="date" label="客户编码"></el-table-column>
      <el-table-column prop="name" label="客户名称"></el-table-column>
      <el-table-column prop="address" label="客户账号"></el-table-column>
      <el-table-column prop="address" label="客户类型"></el-table-column>
      <el-table-column prop="address" sortable label="余额"></el-table-column>
      <el-table-column prop="address" label="业务员"></el-table-column>
      <el-table-column prop="address" label="仓库"></el-table-column>
    </el-table>
    <div class="bottom-desc">
      <div>
        <p>
          本页合计:
          <span>0</span>
        </p>
        <p>
          所有页合计:
          <span>0.00</span>
        </p>
      </div>
      <el-pagination
        background
        layout="total, prev, pager, next,sizes, jumper"
        :page-size="10"
        :page-sizes="[10, 20, 30, 40, 100]"
        style="text-align: right;"
        :total="0"
      />
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        table1: [],
      }
    },
  }
</script>

<style lang="scss" scoped>
  .contents {
    padding: 10px 20px;

    .bottom-desc {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  }
</style>
